<template>
  <div class="examInfo_container">
    <el-row :gutter="10">
      <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" class="left">

        <div class="leftItem">

          <p>
            当前考试名称：

          </p>
          <p class="name">
            {{examInfo.theme}}

          </p>

          <p>
            考试限时：

          </p>
          <p class="name">
            {{examInfo.duration}}分钟

          </p>

          <p>
            考试时间：
          </p>
          <p class="name">
            {{examInfo.startTime}}至 {{examInfo.endTime}}
          </p>

        </div>

        <div class="left_footer">

          <el-button type="primary" @click="toplist()"> 排行榜 </el-button>

          <el-button type="primary" @click="recordlist()">我的考试记录</el-button>

        </div>

      </el-col>
      <el-col :xs="16" :sm="16" :md="16" :lg="16" :xl="16">
        <!-- <bgmusic></bgmusic> -->
        <div class="rightItem">

          <ul class="result">
            <li>
              <span>题型</span>
              <span>总分</span>
              <span>得分</span>
            </li>

            <li>
              <span>单选题</span>
              <span>{{examPaper.singleTotalPoint}}</span>
              <span>{{examResultInfo.single_point}}</span>
            </li>

            <li>
              <span>多选题</span>
              <span>{{examPaper.multipleTotalPoint}}</span>
              <span>{{examResultInfo.multiple_point}}</span>
            </li>

            <li>
              <span>判断题</span>
              <span>{{examPaper.checkTotalPoint}}</span>
              <span>{{examResultInfo.check_point}}</span>
            </li>
            <li>
              <span>填空题</span>
              <span>{{examPaper.completionTotalPoint}}</span>
              <span>{{examResultInfo.completion_point}}</span>
            </li>
            <li>
              <span>不定项</span>
              <span>{{examPaper.unsurenessTotalPoint}}</span>
              <span>{{examResultInfo.unsureness_point}}</span>
            </li>
            <li>
              <span>总分</span>
              <span>{{examPaper.totalPoint}}</span>
              <span>{{examResultInfo.check_point+examResultInfo.single_point+examResultInfo.multiple_point+examResultInfo.unsureness_point+examResultInfo.completion_point}}</span>
            </li>
          </ul>

        </div>
        <div class="right_footer">
          <el-button type="primary" @click="toIndex" class="toIndex"> 返回首页 </el-button>
          <el-button type="primary" @click="toExam">重新答题</el-button>
        </div>

      </el-col>
    </el-row>
  </div>
</template>
<style scoped>
</style>
<script>
import path from '@/network'
// import bgmusic from '../components/bgmusic.vue'
export default {
  name: 'App',
  components: {
    // bgmusic
  },
  data () {
    return {
      examPaper: JSON.parse(sessionStorage.getItem("examPaper")),
      examInfo: JSON.parse(sessionStorage.getItem('examInfo')),
      examResultInfo: JSON.parse(sessionStorage.getItem('examResultInfo')),

      examId: this.$route.query.id,
      checkPoint: '',
      completionPoint: '',
      mulitplePoint: '',
      singlePoint: '',
      totalPoint: '',
      unsurenessPoint: ''
    };
  },
  created () {
  },
  mounted () {

    //this.queryRecord(this.$route.query.id)
  },

  methods: {
    //获取list
    queryRecord () {
      path.queryRecord({
        examId: this.$route.query.id
      }).then(res => {
        if (res.success === 0) {
          this.checkPoint = res.rows.checkPoint
          this.completionPoint = res.rows.completionPoint
          this.mulitplePoint = res.rows.mulitplePoint
          this.singlePoint = res.rows.singlePoint
          this.unsurenessPoint = res.rows.unsurenessPoint
          this.totalPoint = res.rows.totalPoint

        }

      })
    },


    toplist: function () {
      this.$router.push({ name: 'toplist', query: { id: this.$route.query.id, } })
    },

    recordlist: function () {
      this.$router.push({ name: 'recordlist', query: { id: this.$route.query.id, } })
    },

    toIndex: function () {
      this.$router.push({ name: 'index' })
    },

    toExam: function () {
      this.$router.push({ name: 'examList' })
    },




  }
}

</script>